import { RangePicker, Input, Select } from '@/components'
import { Col, Form, Row } from 'antd'
import styles from './index.module.less'

const formConfig = ({ playbookAllList, typeList }) => [
  {
    id: 1,
    type: 'Input',
    formItemProps: {
      label: '调度名称',
      name: 'name',
      rules: [
        {
          required: true,
          message: '请输入1~30个字符，支持中文、英文、数字、.和下划线'
        }
      ]
    },
    props: {
      placeholder: '请输入调度名称'
    }
  },
  // {
  //   id: 2,
  //   type: 'Select',
  //   formItemProps: {
  //     label: '调度标签',
  //     name: 'tags'
  //   },
  //   props: {
  //     placeholder: '请输入剧本标签，最多10个',
  //     mode: 'tags',
  //     maxTagCount: 10
  //   }
  // },
  {
    id: 3,
    type: 'Select',
    formItemProps: {
      label: '调度类型',
      name: 'scheduler_type',
      rules: [{ required: true, message: '请选择调度类型' }]
    },
    props: {
      placeholder: '请选择调度类型',
      options: [
        {
          label: '告警处置',
          value: '告警处置'
        },
        {
          label: '日常运维',
          value: '日常运维'
        }
      ]
    }
  },
  {
    id: 4,
    type: 'Select',
    formItemProps: {
      label: '调度剧本',
      name: 'playbook_ids',
      rules: [{ required: true, message: '请选择调度剧本' }]
    },
    props: {
      placeholder: '请选择调度剧本',
      options: playbookAllList
    }
  },
  {
    id: 5,
    type: 'Select',
    formItemProps: {
      label: '调度方式',
      name: 'type',
      rules: [{ required: true, message: '请选择调度方式' }]
    },
    props: {
      placeholder: '请选择调度方式',
      options: [
        {
          label: '即时调度',
          value: 1
        },
        {
          label: '周期调度',
          value: 2
        },
        {
          label: '定时调度',
          value: 3
        }
      ]
    }
  },
  {
    id: 6,
    render: () => (
      <Form.Item
        noStyle
        shouldUpdate={(pre, cur) => {
          return pre['type'] !== cur['type']
        }}
      >
        {({ getFieldValue }) => (
          <>
            {(getFieldValue(['type']) === 2 ||
              getFieldValue(['type']) === 3) && (
              <Form.Item label="执行时间" name="time">
                <RangePicker className={styles['range-picker']}></RangePicker>
              </Form.Item>
            )}
            {getFieldValue(['type']) === 3 && (
              <Form.Item label="执行频率" required>
                <Row>
                  <Col>
                    <Form.Item
                      name="interval"
                      rules={[
                        {
                          required: true,
                          message: '请输入执行频率'
                        }
                      ]}
                    >
                      <Input></Input>
                    </Form.Item>
                  </Col>
                  <Col>
                    <Form.Item name="unit" initialValue={2}>
                      <Select
                        allowClear={false}
                        options={[
                          {
                            label: '分',
                            value: 2
                          },
                          {
                            label: '时',
                            value: 3
                          },
                          {
                            label: '日',
                            value: 4
                          },

                          {
                            label: '周',
                            value: 5
                          },
                          {
                            label: '月',
                            value: 6
                          }
                        ]}
                      ></Select>
                    </Form.Item>
                  </Col>
                  <Col style={{ lineHeight: '28px' }}>，执行一次</Col>
                </Row>
              </Form.Item>
            )}
          </>
        )}
      </Form.Item>
    )
  }
]


export { formConfig }
